<template>
  <div class="bf-view">
    <el-row v-if="companyData" class="investDetail list-table mb15" :gutter="20">
      <el-col class="" :span="24">
        <div class="area-header">
          <span class="area-header-title">{{ companyData.companyName }}</span>
        </div>
      </el-col>
      <el-col class="" :span="8">
        <span class="label">{{ $t('基金规模') + $t('金额单位') }}：</span>
        <span class="link-hover-click">
          <template v-if="investInfoData.bfBase">
            <el-tag v-if="investInfoData.bfBase.subscribeScale" type="" size="small" effect="plain">
              {{ investInfoData.bfBase.subscribeScale === undefined ? '' : moneyFormat(investInfoData.bfBase.subscribeScale, 'w') }}
            </el-tag>
          </template>
        </span>
      </el-col>
      <el-col class="" :span="8">
        <span class="label">{{ $t('基金实缴金额') + $t('金额单位') }}：</span>
        <span class="link-hover-click">
          <template v-if="investInfoData.bfBase">
            <el-tag v-if="investInfoData.bfBase.paidInScale" type="" size="small" effect="plain">
              {{ investInfoData.bfBase.paidInScale === undefined ? '' : moneyFormat(investInfoData.bfBase.paidInScale, 'w') }}
            </el-tag>
          </template>
        </span>
      </el-col>
      <el-col :span="8" class="">
        <span class="label">{{ $t('基金整体估值') + $t('金额单位') }}：</span>
        <span class="link-hover-click">
          <el-tag v-if="investInfoData.valuation" type="" size="small" effect="plain">
            {{ investInfoData.valuation === undefined ? '' : moneyFormat(investInfoData.valuation, 'w') }}
          </el-tag>
        </span>
      </el-col>
      <el-col :span="8">
        <span class="label">{{ $t('基金编码') }}：</span>
        <span class="link-hover-click">
          <template v-if="investInfoData.bfBase">
            <el-tag v-if="investInfoData.bfBase.fundNumber" type="" size="small" effect="plain">
              {{ investInfoData.bfBase.fundNumber }}
            </el-tag>
          </template>
        </span>
      </el-col>
      <el-col :span="8">
        <span class="label">{{ $t('基金期限') }}：</span>
        <span class="link-hover-click">
          <template v-if="investInfoData.bfBase">
            <el-tag v-if="investInfoData.bfBase.fundTerm" type="" size="small" effect="plain">
              {{ investInfoData.bfBase.fundTerm }}
            </el-tag>
          </template>
        </span>
      </el-col>
      <el-col :span="8">
        <span class="label">{{ $t('基金管理人') }}：</span>
        <span class="link-hover-click">
          <template v-if="investInfoData.bfBase">
            <el-tag v-if="investInfoData.bfBase.manageCompanyName" type="" size="small" effect="plain">
              {{ investInfoData.bfBase.manageCompanyName }}
            </el-tag>
          </template>
        </span>
      </el-col>
      <el-col :span="24">
        <span class="label">{{ $t('投资主体') }}：</span>
        <span class="link-hover-click">
          <div class="tagInvest">
            <el-tag v-for="(item, index) in investList" :key="index" type="success" size="small" effect="plain">{{ item }}</el-tag>
          </div>
        </span>
      </el-col>
      <el-col :span="8">
        <span class="label">{{ $t('团队成员') }}：</span>
        <span class="link-hover-click">
          <div v-if="investInfoData.dealInfo && investInfoData.dealInfo.team">
            <el-tag v-for="tag in investInfoData.dealInfo.team" :key="tag.id" size="small" effect="plain">{{ tag.user.nickName }}</el-tag>
            <el-tag v-if="!investInfoData.dealInfo.team || investInfoData.dealInfo.team.length === 0" size="small" effect="plain" style="border: none !important">&nbsp;</el-tag>
          </div>
        </span>
      </el-col>
      <el-col :span="16">
        <span class="label">{{ $t('外派人员') }}：</span>
        <span class="link-hover-click">
          <div v-if="investInfoData.dealInfo && investInfoData.dealInfo.expats">
            <el-tag v-for="tag in investInfoData.dealInfo.expats" :key="tag.id" size="small" effect="plain">{{ tag.user.nickName }}</el-tag>
            <el-tag v-if="!investInfoData.dealInfo.expats || investInfoData.dealInfo.expats.length === 0" size="small" effect="plain" style="border: none !important">&nbsp;</el-tag>
          </div>
        </span>
      </el-col>
      <el-col :span="8">
        <span class="label">{{ $t('IRR') }}：</span>
        <span class="link-hover-click">{{ investInfoData.latestIrr === undefined || investInfoData.latestIrr === null || investInfoData.latestIrr === '' ? '' : (investInfoData.latestIrr === 0 ? '' : (investInfoData.latestIrr).toFixed(6)) }}</span>
      </el-col>
      <el-col v-if="investInfoData.dealInfo && investInfoData.dealInfo" :span="8">
        <template v-if="investInfoData.dealInfo.cashflow">
          <span class="label">{{ $t('MOIC') }}：</span>
          <span class="link-hover-click">{{ investInfoData.dealInfo.cashflow.moic === undefined || investInfoData.dealInfo.cashflow.moic === null || investInfoData.dealInfo.cashflow.moic === '' ? '' : (investInfoData.dealInfo.cashflow.moic === 0 ? '' : (investInfoData.dealInfo.cashflow.moic).toFixed(6)) }}</span>
        </template>
        <template v-else>
          <span class="label">{{ $t('MOIC') }}：</span>
          <span class="link-hover-click">&nbsp;</span>
        </template>
      </el-col>
      <el-col v-if="investInfoData.dealInfo && investInfoData.dealInfo" :span="8">
        <template v-if="investInfoData.dealInfo.cashflow">
          <span class="label">{{ $t('DPI') }}：</span>
          <span class="link-hover-click">{{ investInfoData.dealInfo.cashflow.dpi === undefined || investInfoData.dealInfo.cashflow.dpi === null || investInfoData.dealInfo.cashflow.dpi === '' ? '' : (investInfoData.dealInfo.cashflow.dpi === 0 ? '' : (investInfoData.dealInfo.cashflow.dpi).toFixed(6)) }}</span>
        </template>
        <template v-else>
          <span class="label">{{ $t('DPI') }}：</span>
          <span class="link-hover-click">&nbsp;</span>
        </template>
      </el-col>
      <el-col :span="8">
        <span class="label">{{ $t('认缴时间') }}：</span>
        <span class="link-hover-click">
          {{ parseTime(investInfoData.investmentSignTime) }}
        </span>
      </el-col>
      <el-col :span="8">
        <span class="label">{{ $t('认缴比例(%)') }}：</span>
        <span class="link-hover-click">
          {{ investInfoData.latestShareholdingRatioSum === undefined || investInfoData.latestShareholdingRatioSum === null || investInfoData.latestShareholdingRatioSum === '' ? '' : (investInfoData.latestShareholdingRatioSum === 0 ? '' : (investInfoData.latestShareholdingRatioSum).toFixed(6)) }}
        </span>
      </el-col>
      <el-col :span="8">
        <span class="label">{{ $t('认缴金额') + $t('金额单位') }}：</span>
        <span class="link-hover-click">
          {{ investInfoData.agreementMoneySum === undefined ? '' : moneyFormat(investInfoData.agreementMoneySum, 'w') }}
        </span>
      </el-col>
      <el-col :span="8">
        <span class="label">{{ $t('实缴金额') + $t('金额单位') }}：</span>
        <span class="link-hover-click">
          {{ investInfoData.amountInvestmentFactSum === undefined ? '' : moneyFormat(investInfoData.amountInvestmentFactSum, 'w') }}
        </span>
      </el-col>
      <el-col :span="8">
        <span class="label">{{ $t('分配金额') + $t('金额单位') }}：</span>
        <span class="link-hover-click">
          {{ investInfoData.hkTotal === undefined ? '' : moneyFormat(investInfoData.hkTotal, 'w') }}
        </span>
      </el-col>
      <el-col :span="8">
        <span class="label">{{ $t('所占最新估值') + $t('金额单位') }}：</span>
        <span class="link-hover-click">
          {{ investInfoData.gzTotal === undefined ? '' : moneyFormat(investInfoData.gzTotal, 'w') }}
        </span>
      </el-col>
      <el-col :span="24">
        <span class="label">{{ $t('项目介绍') }}：</span>
        <span class="link-hover-click pre" style="max-height: 230px;overflow: auto">{{ companyData.remark === undefined ?
          '' : companyData.remark }}</span>
      </el-col>
    </el-row>
    <div class="block_info mb15">
      <div class="block_item">
        <div class="flex1">
          <p>{{ $t('已完成投资金额') }}</p>
          <p><span class="bold">{{ moneyFormat(investGroupMap.completedInvestmentAmount, 'w') + $t('金额单位') }}</span></p>
        </div>
        <span class="iconfon"><i class="iconfont icon-money_fill" /></span>
      </div>
      <div class="block_item">
        <div class="flex1">
          <p>{{ $t('已完成投资比例(%)') }}</p>
          <p><span class="bold">{{ investGroupMap.completedInvestmentRatio }}</span>%</p>
        </div>
        <span class="iconfon"><i class="iconfont icon-bingtutongji" /></span>
      </div>
      <div class="block_item">
        <div class="flex1">
          <p>{{ $t('已完成投资数量') }}</p>
          <p><span class="bold">{{ investGroupMap.completedInvestmentNum }}</span>{{ $t('项') }}</p>
        </div>
        <span class="iconfon"><i class="iconfont icon-dingdan-yiwancheng" /></span>
      </div>
      <div class="block_item">
        <div class="flex1">
          <p>{{ $t('已上市项目') }}</p>
          <p><span class="bold">{{ investGroupMap.listedProjectNum }}</span>{{ $t('个') }}</p>
        </div>
        <span class="iconfon"><i class="iconfont icon-trend-fill" /></span>
      </div>
      <div class="block_item">
        <div class="flex1">
          <p>{{ $t('已退出项目') }}</p>
          <p><span class="bold">{{ investGroupMap.exitedProjectNum }}</span>{{ $t('个') }}</p>
        </div>
        <span class="iconfon"><i class="iconfont icon-tuichu1" /></span>
      </div>
    </div>
    <el-row class="mb15" :gutter="20">
      <el-col :span="8">
        <div class="list-table">
          <div class="area-header finance">
            <span class="area-header-title">
              {{ $t('按行业分类') }}
            </span>
            <div>
              <el-select v-model="industry" size="mini" style="width: 100px;" @change="onChange(industry, '1')">
                <el-option :label="$t('划款金额')" value="invest" />
                <el-option :label="$t('最新估值')" value="valuation" />
              </el-select>
            </div>
          </div>
          <div style="height: 400px;position: relative;">
            <pieChart v-if="chartData1.datas.length > 0" :chart-data="chartData1" height="100%" />
            <div v-else class="noneData">
              <div>
                <svg-icon icon-class="none" class-name="none-icon" />
                <p>{{ $t('暂无数据') }}</p>
              </div>
            </div>
          </div>
        </div>
      </el-col>
      <el-col :span="8">
        <div class="list-table">
          <div class="area-header finance">
            <span class="area-header-title">
              {{ $t('上市情况') }}
            </span>
            <div>
              <el-select v-model="listed" size="mini" style="width: 100px;" @change="onChange(listed, '1')">
                <el-option :label="$t('划款金额')" value="invest" />
                <el-option :label="$t('最新估值')" value="valuation" />
              </el-select>
            </div>
          </div>
          <div style="height: 400px;position: relative;">
            <pieChart v-if="chartData2.datas.length > 0" :chart-data="chartData2" height="100%" />
            <div v-else class="noneData">
              <div>
                <svg-icon icon-class="none" class-name="none-icon" />
                <p>{{ $t('暂无数据') }}</p>
              </div>
            </div>
          </div>
        </div>
      </el-col>
      <el-col :span="8">
        <div class="list-table">
          <div class="area-header finance">
            <span class="area-header-title">
              {{ $t('投资类型') }}
            </span>
            <div>
              <el-select v-model="investType" size="mini" style="width: 100px;" @change="onChange(investType, '1')">
                <el-option :label="$t('划款金额')" value="invest" />
                <el-option :label="$t('最新估值')" value="valuation" />
              </el-select>
            </div>
          </div>
          <div style="height: 400px;position: relative;">
            <pieChart v-if="chartData3.datas.length > 0" :chart-data="chartData3" height="100%" />
            <div v-else class="noneData">
              <div>
                <svg-icon icon-class="none" class-name="none-icon" />
                <p>{{ $t('暂无数据') }}</p>
              </div>
            </div>
          </div>
        </div>
      </el-col>
    </el-row>
    <div class="list-table mb15">
      <div class="area-header">
        <span class="area-header-title">
          <el-radio-group v-model="radio1" size="mini" class="mr15" @change="getBfInvestGroupList">
            <el-radio-button label="deal">{{ $t('投资项目') }}</el-radio-button>
            <el-radio-button label="fund">{{ $t('投资基金') }}</el-radio-button>
          </el-radio-group>
          <el-radio-group v-if="radio1 === 'deal'" v-model="radio2" @change="getBfInvestGroupList">
            <el-radio :label="1">{{ $t('项目信息') }}</el-radio>
            <el-radio :label="2">{{ $t('上市情况') }}</el-radio>
          </el-radio-group>
        </span>
      </div>
      <div>
        <el-table v-if="radio1 === 'deal' && radio2 === 1" v-loading="groupLoading" tooltip-effect="darkTable" :data="investDealInfoList" border>
          <el-table-column fixed="left" :label="$t('序号')" type="index" align="center" show-overflow-tooltip width="50">
            <template slot-scope="scope">
              {{ (investDealParam.pageNum - 1) * investDealParam.pageSize + scope.$index + 1 }}
            </template>
          </el-table-column>
          <el-table-column fixed="left" :label="$t('项目简称')" align="center" prop="company.companyName" show-overflow-tooltip min-width="180">
            <template slot-scope="scope">
              <router-link
                target="_blank"
                :to="{path:'/company/base/companyBaseHome',query:{companyId:scope.row.indirectDealId, dealId:scope.row.dealId, source:'BF_PORTFOLIO'}}"
                class="link_a"
              >{{ scope.row.company.companyName }}</router-link>
            </template>
          </el-table-column>
          <el-table-column :label="$t('所属行业')" align="center" prop="company.industryFirstLabel" show-overflow-tooltip width="120" />
          <el-table-column :label="$t('企业阶段')" align="center" prop="enterpriseStage" show-overflow-tooltip width="120" :formatter="enterpriseStageFormat" />
          <el-table-column :label="$t('投资时间')" align="center" prop="investmentTime" show-overflow-tooltip width="120">
            <template slot-scope="scope">
              <span>{{ parseTime(scope.row.investmentTime) }}</span>
            </template>
          </el-table-column>
          <el-table-column :label="$t('投资金额') + $t('金额单位')" align="center" prop="bfPortfolioVo.total" show-overflow-tooltip min-width="120">
            <template slot-scope="scope">
              <span class="money-text">{{ moneyFormat(scope.row.bfPortfolioVo.total, 'w') }}</span>
            </template>
          </el-table-column>
          <el-table-column :label="$t('最新持股比例(%)')" align="center" prop="latestShareholdingRatio" show-overflow-tooltip min-width="120">
            <template slot-scope="scope">
              <span>{{ moneyFormat(scope.row.latestShareholdingRatio) }}</span>
            </template>
          </el-table-column>
          <el-table-column :label="$t('企业最新估值') + $t('金额单位')" align="center" prop="bfPortfolioVo.companyWholeVal" show-overflow-tooltip width="140">
            <template slot-scope="scope">
              <span class="money-text">{{ moneyFormat(scope.row.bfPortfolioVo.companyWholeVal, 'w') }}</span>
            </template>
          </el-table-column>
          <el-table-column :label="$t('项目估值') + $t('金额单位')" align="center" prop="bfPortfolioVo.latestValuation" show-overflow-tooltip width="120">
            <template slot-scope="scope">
              <span class="money-text">{{ moneyFormat(scope.row.bfPortfolioVo.latestValuation, 'w') }}</span>
            </template>
          </el-table-column>
          <!--          <el-table-column :label="$t('子基金投资价值') + $t('金额单位')" align="center" prop="prop9" show-overflow-tooltip width="140">
            <template slot-scope="scope">
              <span class="money-text">{{ moneyFormat((scope.row.bfPortfolioVo.amountRecovered + scope.row.bfPortfolioVo.loss), 'w') }}</span>
            </template>
          </el-table-column>-->
          <el-table-column :label="$t('回款金额') + $t('金额单位')" align="center" prop="bfPortfolioVo.amountRecovered" show-overflow-tooltip width="120">
            <template slot-scope="scope">
              <span>{{ moneyFormat(scope.row.bfPortfolioVo.amountRecovered, 'w') }}</span>
            </template>
          </el-table-column>
        </el-table>
        <pagination
          v-if="radio1 === 'deal' && radio2 === 1"
          v-show="dealTotal>0"
          :total="dealTotal"
          :page.sync="investDealParam.pageNum"
          :limit.sync="investDealParam.pageSize"
          @pagination="getInvestGroupDealInfoList"
        />
      </div>
      <div>
        <el-table v-if="radio1 === 'deal' && radio2 === 2" v-loading="groupLoading" tooltip-effect="darkTable" :data="investDealListedList" border>
          <el-table-column fixed="left" :label="$t('序号')" type="index" align="center" show-overflow-tooltip width="50">
            <template slot-scope="scope">
              {{ (investDealListedParam.pageNum - 1) * investDealListedParam.pageSize + scope.$index + 1 }}
            </template>
          </el-table-column>
          <el-table-column fixed="left" :label="$t('项目名称')" align="center" prop="company.companyName" show-overflow-tooltip min-width="180">
            <template slot-scope="scope">
              <router-link
                target="_blank"
                :to="{path:'/company/base/companyBaseHome',query:{companyId:scope.row.indirectDealId, dealId:scope.row.dealId, source:'BF_PORTFOLIO'}}"
                class="link_a"
              >{{ scope.row.company.companyName }}</router-link>
            </template>
          </el-table-column>
          <el-table-column :label="$t('投资币种')" align="center" prop="dealCurrency" :formatter="dealCurrencyFormat" show-overflow-tooltip width="100" />
          <el-table-column :label="$t('投资金额') + $t('金额单位')" align="center" prop="bfPortfolioVo.total" show-overflow-tooltip min-width="120">
            <template slot-scope="scope">
              <span class="money-text">{{ moneyFormat(scope.row.bfPortfolioVo.total, 'w') }}</span>
            </template>
          </el-table-column>
          <el-table-column :label="$t('持股比例(%)')" align="center" prop="latestShareholdingRatio" show-overflow-tooltip min-width="120">
            <template slot-scope="scope">
              <span>{{ moneyFormat(scope.row.latestShareholdingRatio) }}</span>
            </template>
          </el-table-column>
          <el-table-column :label="$t('上市情况')" align="center" prop="company.listedSituation" show-overflow-tooltip width="120">
            <template slot-scope="scope">
              <span>{{ listedSituationyFormat(scope.row.company.listedSituation) }}</span>
            </template>
          </el-table-column>
          <el-table-column :label="$t('上市板块')" align="center" prop="company.listedSituation" show-overflow-tooltip width="100">
            <template slot-scope="scope">
              <span>{{ listedSectorFormat(scope.row.company.listedSector) }}</span>
            </template>
          </el-table-column>
          <el-table-column :label="$t('币种')" align="center" prop="company.stockCurrency" show-overflow-tooltip width="100">
            <template slot-scope="scope">
              <span>{{ stockCurrencyFormat(scope.row.company.stockCurrency) }}</span>
            </template>
          </el-table-column>
          <el-table-column :label="$t('上市/过会/申报时间')" align="center" prop="company.listedTime" show-overflow-tooltip width="140">
            <template slot-scope="scope">
              <span>{{ parseTime(scope.row.company.listedTime) }}</span>
            </template>
          </el-table-column>
          <el-table-column :label="$t('股票代码')" align="center" prop="company.stockCode" show-overflow-tooltip width="120">
            <template slot-scope="scope">
              <span>{{ scope.row.company.stockCode }}</span>
            </template>
          </el-table-column>
          <el-table-column :label="$t('子基金持股数(股)')" align="center" prop="sonFundShares" show-overflow-tooltip width="140">
            <template slot-scope="scope">
              <span>{{ moneyFormat(scope.row.sonFundShares) }}</span>
            </template>
          </el-table-column>
          <el-table-column :label="$t('每股投资成本(元)')" align="center" prop="perShareInvestCost" show-overflow-tooltip width="140">
            <template slot-scope="scope">
              <span>{{ moneyFormat(scope.row.perShareInvestCost) }}</span>
            </template>
          </el-table-column>
        </el-table>
        <pagination
          v-if="radio1 === 'deal' && radio2 === 2"
          v-show="dealListedTotal>0"
          :total="dealListedTotal"
          :page.sync="investDealListedParam.pageNum"
          :limit.sync="investDealListedParam.pageSize"
          @pagination="getInvestGroupDealListed"
        />
      </div>
      <el-table v-if="radio1 === 'fund'" v-loading="groupLoading" tooltip-effect="darkTable" :data="investFundList" border>
        <el-table-column fixed="left" :label="$t('序号')" type="index" align="center" show-overflow-tooltip width="50">
          <template slot-scope="scope">
            {{ (investFundParam.pageNum - 1) * investFundParam.pageSize + scope.$index + 1 }}
          </template>
        </el-table-column>
        <el-table-column fixed="left" :label="$t('基金名称')" align="center" prop="fundName" min-width="180" show-overflow-tooltip>
          <template slot-scope="scope">
            <el-link type="primary" @click="investFundHandle(scope.row)">{{ scope.row.fundName }}</el-link>
          </template>
        </el-table-column>
        <el-table-column :label="$t('基金管理人')" align="center" prop="managerName" show-overflow-tooltip width="120" />
        <el-table-column :label="$t('基金期限')" align="center" prop="fundTerm" show-overflow-tooltip width="120" />
        <el-table-column :label="$t('基金总规模')+$t('金额单位')" align="center" prop="fundSize" min-width="180" show-overflow-tooltip>
          <template slot-scope="scope">
            <span>{{ moneyFormat(scope.row.fundSize, 'w') }}</span>
          </template>
        </el-table-column>
        <el-table-column :label="$t('母基金认缴比例(%)')" align="center" prop="subscriptionRatio" min-width="180" show-overflow-tooltip>
          <template slot-scope="scope">
            <span>{{ moneyFormat(scope.row.subscriptionRatio) }}</span>
          </template>
        </el-table-column>
        <el-table-column :label="$t('母基金认缴金额')+$t('金额单位')" align="center" prop="subscriptionAmount" min-width="180" show-overflow-tooltip>
          <template slot-scope="scope">
            <span>{{ moneyFormat(scope.row.subscriptionAmount, 'w') }}</span>
          </template>
        </el-table-column>
      </el-table>
      <pagination
        v-if="radio1 === 'fund'"
        v-show="fundTotal>0"
        :total="fundTotal"
        :page.sync="investFundParam.pageNum"
        :limit.sync="investFundParam.pageSize"
        @pagination="getInvestGroupFund"
      />
    </div>
    <div class="list-table mb15">
      <div class="area-header">
        <span class="area-header-title">
          {{ $t('出资人信息') }}
        </span>
      </div>
      <el-table v-loading="capitalLoading" tooltip-effect="darkTable" :data="bfCapitalList" border>
        <el-table-column :label="$t('序号')" type="index" fixed="left" align="center" show-overflow-tooltip width="50">
          <template slot-scope="scope">
            {{ (capitalParams.pageNum - 1) * capitalParams.pageSize + scope.$index + 1 }}
          </template>
        </el-table-column>
        <el-table-column :label="$t('股东名称')" fixed="left" align="center" prop="actTitle" :show-overflow-tooltip="true" min-width="200">
          <template slot-scope="scope">
            <span v-if="scope.row.dataSource === 'investment'">{{ scope.row.investmentInvestorName }}</span>
            <span v-else>{{ scope.row.investorName }}</span>
          </template>
        </el-table-column>
        <el-table-column :label="$t('出资人类型')" align="center" prop="investorType" :formatter="investorTypeFormat" min-width="150" />
        <el-table-column :label="$t('认缴金额') + $t('金额单位')" align="center" prop="subscribeAmount" min-width="130">
          <template slot-scope="scope">
            <span class="money-text">{{ moneyFormat(scope.row.subscribeAmount, 'w') }}</span>
          </template>
        </el-table-column>
        <el-table-column :label="$t('认缴比例(%)')" align="center" prop="shareRatio" min-width="130">
          <template slot-scope="scope">
            <span>{{ moneyFormat(scope.row.shareRatio) }}</span>
          </template>
        </el-table-column>
        <el-table-column :label="$t('实缴金额') + $t('金额单位')" align="center" prop="totalPaidIn" min-width="140">
          <template slot-scope="scope">
            <span class="money-text">{{ moneyFormat(scope.row.totalPaidIn, 'w') }}</span>
          </template>
        </el-table-column>
        <el-table-column :label="$t('操作')" fixed="right" align="center" class-name="small-padding fixed-width" width="100">
          <template slot-scope="scope">
            <el-button
              size="small"
              type="text"
              icon="el-icon-view"
              @click="viewHandle(scope.row)"
            >{{ $t('查看') }}
            </el-button>
          </template>
        </el-table-column>
      </el-table>
      <pagination
        v-show="capitalTotal>0"
        :total="capitalTotal"
        :page.sync="capitalParams.pageNum"
        :limit.sync="capitalParams.pageSize"
        @pagination="getBfCapitalList"
      />
    </div>
    <el-row class="mb15" :gutter="20">
      <el-col :span="12">
        <div class="list-table">
          <div class="area-header">
            <span class="area-header-title">{{ $t(' 项目最新事件') }}</span>
          </div>
          <div style="height: 400px;">
            <dealEvent ref="dealEvent" :deal-id="businessId" />
          </div>
        </div>
      </el-col>
      <el-col :span="12">
        <div class="list-table">
          <div class="area-header finance">
            <span class="area-header-title">
              {{ $t('信息披露') }}
            </span>
            <div>
              <el-button type="primary" size="mini" icon="el-icon-plus" @click="addHandle">{{ '新增' }}</el-button>
            </div>
          </div>
          <div style="height: 393px;">
            <el-table v-loading="loading" tooltip-effect="darkTable" :data="bfDisclosureInfoList" border height="338px">
              <el-table-column :label="$t('报告期')" align="center" prop="reportStage" show-overflow-tooltip>
                <template slot-scope="scope">
                  <span class="link-type" @click="updateHandle(scope.row)">{{ scope.row.reportStage }}</span>
                </template>
              </el-table-column>
              <el-table-column :label="$t('文件类型')" align="center" prop="fileType" :formatter="fileTypeFormat" show-overflow-tooltip />
              <el-table-column :label="$t('文件名称')" align="center" prop="fileName" show-overflow-tooltip>
                <template slot-scope="scope">
                  <a v-if="scope.row.fileName !== '' || scope.row.fileName != null" class="link_a" @click="onlinePreview(scope.row, 'view')">
                    <div style="text-align: left;overflow: hidden; text-overflow: ellipsis; white-space: nowrap;">{{ scope.row.fileName }}</div>
                  </a>
                </template>
              </el-table-column>
            </el-table>
            <pagination
              v-show="disclosureTotal>0"
              :total="disclosureTotal"
              :page.sync="disclosureParams.pageNum"
              :limit.sync="disclosureParams.pageSize"
              @pagination="getBfDisclosureList"
            />
          </div>
        </div>
      </el-col>
    </el-row>
    <div class="list-table">
      <div class="area-header">
        <span class="area-header-title">{{ $t('项目现金流') }}</span>
        <el-radio-group v-model="cashFlowRadio" @input="onCashFlow">
          <el-radio :label="1">{{ $t('指标') }}</el-radio>
          <el-radio :label="2">{{ $t('现金流') }}</el-radio>
          <el-radio :label="3">{{ $t('TVPI变化') }}</el-radio>
        </el-radio-group>
      </div>
      <el-table v-show="cashFlowRadio === 1" v-loading="loading" tooltip-effect="darkTable" :data="quotaList.data" class="quotaList" border height="320">
        <el-table-column v-for="col in quotaList.columns" :key="col.prop" :width="col.prop === 'type' ? '120' : ''" :label="$t(col['label'])" align="center" prop="quota" :fixed="col.prop === 'type'?'left' : false" min-width="110">
          <template slot-scope="scope">
            <span v-if="col.prop === 'type'">{{ scope.row['type'] ? selectDictLabel(indicatorOptions,scope.row['type']) : '' }}</span>
            <span v-else-if="scope.row['type'] === 'dealIrr' || scope.row['type'] === 'dealMoic'">
              <el-link v-if="scope.row['type'] === 'dealIrr'" type="primary" @click="findXIrrDetails(scope.row[col.prop].id)">{{ scope.row[col.prop] ? moneyFormat(scope.row[col.prop].xirr, undefined, 2, true) : '' }}</el-link>
              <span v-else>{{ scope.row[col.prop] ? scope.row[col.prop].xirr : '' }}</span>
            </span>
            <span v-else>{{ moneyFormat(scope.row[col.prop],'w') }}</span>
          </template>
        </el-table-column>
      </el-table>
      <div v-show="cashFlowRadio === 2">
        <el-table v-loading="cashLoading" tooltip-effect="darkTable" :data="dealCashflowList" border>
          <el-table-column :label="$t('承担主体')" align="center" prop="investorName" min-width="150">
            <template slot-scope="scope">
              <span class="link-type" @click="investorHandle(scope.row)">{{ scope.row.investorName }}</span>
            </template>
          </el-table-column>
          <el-table-column :label="$t('业务类型')" align="center" prop="operateType" min-width="90">
            <template slot-scope="scope">
              <span>{{ selectDictLabel(operateTypeOptions,scope.row.operateType) }}</span>
            </template>
          </el-table-column>
          <el-table-column :label="$t('发生时间')" align="center" prop="operateDate" min-width="100">
            <template slot-scope="scope">
              <span>{{ parseTime(scope.row.operateDate,'{y}-{m}-{d}') }}</span>
            </template>
          </el-table-column>
          <el-table-column :label="$t('发生金额') + $t('金额单位')" align="center" prop="operateAmount" min-width="100">
            <template slot-scope="scope">
              <span>{{ moneyFormat(scope.row.operateAmount,'w') }}</span>
            </template>
          </el-table-column>
        </el-table>
        <pagination
          v-show="cashflowTotal>0"
          :total="cashflowTotal"
          :page.sync="cashflowParams.pageNum"
          :limit.sync="cashflowParams.pageSize"
          @pagination="getCashflowList"
        />
      </div>
      <div v-if="cashFlowRadio === 3" id="echarts3" style="height:320px;width:100%;">
        <lineChart v-if="lineChartData.datas.length > 0" height="100%" :chart-data="lineChartData" />
        <div v-else class="noneData">
          <div>
            <svg-icon icon-class="none" class-name="none-icon" />
            <p>{{ $t('暂无数据') }}</p>
          </div>
        </div>
      </div>
    </div>
    <!-- 添加或修改出资人信息对话框 -->
    <el-dialog
      :title="$t('出资人信息')"
      :visible.sync="formCapitalOpen"
      :close-on-click-modal="false"
      :lock-scroll="false"
      custom-class="dialogForm"
      append-to-body
    >
      <bfCapitalForm ref="bfCapitalForm" />
    </el-dialog>
    <!-- 添加或修改参股基金信息披露对话框 -->
    <el-dialog :title="$t('信息披露')" :visible.sync="formOpen" :close-on-click-modal="false" :lock-scroll="false" custom-class="dialogForm" append-to-body>
      <bfDisclosureInfoForm ref="bfDisclosureInfoForm" />
    </el-dialog>
    <el-dialog :title="$t('投资主体')" :visible.sync="investorOpen" :close-on-click-modal="false" :lock-scroll="false" :destroy-on-close="true" append-to-body custom-class="dialogForm">
      <dealInvestmentForm ref="dealInvestmentForm" />
    </el-dialog>

    <!-- 添加或修改基金项目对话框 -->
    <el-dialog
      :title="$t('基金项目')"
      :visible.sync="investFundOpen"
      :close-on-click-modal="false"
      :lock-scroll="false"
      custom-class="dialogForm"
      append-to-body
    >
      <bfInvestFundForm ref="bfInvestFundForm" />
    </el-dialog>

    <!-- 添加或修改xIrr计算明细对话框 -->
    <el-dialog :title="$t('计算明细')" :visible.sync="xIrrOpen" :close-on-click-modal="false" :lock-scroll="false" :width="'50%'" custom-class="customDialog" append-to-body>
      <xIrrBaseDetailsList ref="xIrrBaseDetailsList" />
      <div slot="footer" class="dialog-footer mt-15" style="text-align: right;">
        <el-button
          type="warning"
          icon="el-icon-download"
          size="mini"
          @click="exportXIrrHandle"
        >{{ $t('导出') }}
        </el-button>
      </div>
    </el-dialog>

    <!-- 预览附件 -->
    <OnlinePreview ref="OnlinePreview" :preview-tit="previewTit" />
  </div>
</template>
<script>
import { getCompanyBaseByDealId } from '@/api/company/base/companyBase'
import { getByIdBfDefaultBaseInfo } from '@/api/deal/investment/dealInvestment'
import dealEvent from '@/components/dealEvent'
import { listBfDisclosureInfoHome } from '@/api/bf/disclosure/bfDisclosureInfo'
import { getDealCashFLowBfInfo, getDealInfoData, getBfDicts, getXirrDataByType } from '@/api/base/deal/dealBase'
import { dealInvestGroupTarget, listBfInvestGroup } from '@/api/bf/investGroup/bfInvestGroup'
import { getChartBfData } from '@/api/bf/base/bfBase'
import { listBfInvestFund } from '@/api/bf/investGroup/bfInvestFund'
import { listBfCapital } from '@/api/bf/capital/bfCapital'
import bfCapitalForm from '@/views/bf/capital/bfCapitalForm'
import bfDisclosureInfoForm from '@/views/bf/disclosure/bfDisclosureInfoForm'
import { listDealCashflow } from '@/api/deal/cashflow/dealCashflow'
import dealInvestmentForm from '@/views/deal/investment/dealInvestmentForm'
import bfInvestFundForm from '@/views/bf/investGroup/bfInvestFundForm'
import xIrrBaseDetailsList from '@/components/Xirr/details/xirrBaseDetailsList'
import pieChart from '@/views/chart/pieChart'
import lineChart from '@/views/chart/lineChart.vue'
export default {
  components: {
    dealEvent,
    pieChart,
    lineChart,
    bfCapitalForm,
    bfDisclosureInfoForm,
    dealInvestmentForm,
    bfInvestFundForm,
    xIrrBaseDetailsList
  },
  data() {
    return {
      loading: true,
      // 投资主体
      investorOpen: false,
      // 投资组合基金项目
      investFundOpen: false,
      xIrrOpen: false,
      investList: [],
      companyData: {},
      investInfoData: {},
      cashflowParams: {
        pageNum: 1,
        pageSize: 10,
        dealId: this.$route.query.id
      },
      previewTit: '',
      formOpen: false,
      listed: 'invest',
      industry: 'invest',
      investType: 'invest',
      formCapitalOpen: false,
      capitalLoading: true,
      cashLoading: true,
      options: [],
      disclosureLoading: [],
      disclosureTotal: 0,
      cashflowTotal: 0,
      capitalTotal: 0,
      businessId: this.$route.query.id,
      // 出资人列表
      bfCapitalList: [],
      // 查询参数
      capitalParams: {
        dealId: this.$route.query.id,
        pageNum: 1,
        pageSize: 10
      },
      // 企业阶段字典
      enterpriseStageOptions: [],
      // 指标字典
      indicatorOptions: [],
      // 币种字典
      currencyOptions: [],
      // 上市情况字典
      listedSituationOptions: [],
      // 上市板块字典
      listedSectorOptions: [],
      // 出资人类型字典
      investorTypeOptions: [],
      radio1: 'deal',
      radio2: 1,
      investDealParam: {
        dealId: this.$route.query.id,
        pageNum: 1,
        pageSize: 10
      },
      disclosureParams: {
        dealId: this.$route.query.id,
        pageNum: 1,
        pageSize: 10
      },
      investDealListedParam: {
        dealId: this.$route.query.id,
        pageNum: 1,
        pageSize: 10
      },
      investFundParam: {
        dealId: this.$route.query.id,
        pageNum: 1,
        pageSize: 10
      },
      dealTotal: 0,
      fundTotal: 0,
      groupLoading: false,
      dealListedTotal: 0,
      investDealList: [],
      investFundList: [],
      investDealInfoList: [],
      investDealListedList: [],
      bfDisclosureInfoList: [],
      // 文件类型字典
      fileTypeOptions: [],
      // 现金流-业务类型字典
      operateTypeOptions: [],
      cashFlowRadio: 1,
      quotaList: {
        columns: [],
        data: []
      },
      tvpiChart: {
        xData: [],
        yData: []
      },
      // 查询投资汇总数据
      investGroupMap: {
        // 已完成投资金额(万) 当前基金投资股权项目划款金额+当前基金投资的基金项目实缴金额
        completedInvestmentAmount: undefined,
        // 已完成投资比例(%) 已完成投资金额/基金规模
        completedInvestmentRatio: undefined,
        // 已完成投资数量 当前基金投资股权项目数量+当前基金投资的基金项目数量
        completedInvestmentNum: undefined,
        // 已上市项目 当前基金投资股权项目->上市情况->已上市的项目个数
        listedProjectNum: undefined,
        // 已退出项目 当前基金投资股权项目(最新持股比例为0) + 基金项目->退出状态->全部退出的项目个数
        exitedProjectNum: undefined
      },
      dealCashflowList: [],
      chartData1: {
        valueFormatter: true,
        datas: []
      },
      chartData2: {
        valueFormatter: true,
        datas: []
      },
      chartData3: {
        valueFormatter: true,
        datas: []
      },
      lineChartData: {
        datas: []
      }
    }
  },
  computed: {
  },
  created() {
    getBfDicts().then(res => {
      this.indicatorOptions = res.data
    })
    // 企业阶段
    this.getDicts('enterprise_stage').then(response => {
      this.enterpriseStageOptions = response.data
    })
    // 币种
    this.getDicts('currency').then(response => {
      this.currencyOptions = response.data
    })
    // 上市情况
    this.getDicts('bf_group_listed_situation').then(response => {
      this.listedSituationOptions = response.data
    })
    // 上市板块
    this.getDicts('bf_group_listed_sector').then(response => {
      this.listedSectorOptions = response.data
    })
    // 出资人类型
    this.getDicts('investor_type').then(response => {
      this.investorTypeOptions = response.data
    })
    // 信息披露文件类型
    this.getDicts('disclosure_file_type').then(response => {
      this.fileTypeOptions = response.data
    })
    // 现金流业务类型
    this.getDicts('deal_cash_flow_type').then(response => {
      this.operateTypeOptions = response.data
    })
  },
  mounted() {
    // 基本信息
    this.init()
    // 投资echarts图表数据
    this.dealInvestGroupData()
    // 获取投资组合列表数据（投资项目、投资基金）
    this.getBfInvestGroupList()
    // 获取出资人信息列表
    this.getBfCapitalList()
    // 获取信息披露列表
    this.getBfDisclosureList()
    // 数据指标
    this.getDealCashFLowInfo({ dealId: this.$route.query.id, type: this.cashFlowRadio })
  },
  methods: {
    // 初始化数据
    init() {
      this.loading = true
      this.investList = []
      this.companyData = {}
      getCompanyBaseByDealId(this.$route.query.id, this.$route.query.companyId).then(response => {
        this.companyData = response.data
        getByIdBfDefaultBaseInfo(this.$route.query.id, this.$route.query.companyId).then(response => {
          this.investInfoData = response.data[0]
          getDealInfoData(this.$route.query.id).then(res => {
            this.$set(this.investInfoData, 'dealInfo', res.data)
          })
          if (this.investInfoData?.name !== undefined && this.investInfoData.name !== '') {
            this.investList = this.investInfoData.name.split(',')
          }
        })
        this.loading = false
      })
      this.changeFund()
    },
    onChange(type, key) {
      var fundId = this.$route.query.id
      if (key === '1') {
        getChartBfData('industry', type, fundId).then(res => {
          this.chartData1.datas = res.data || []
          this.chartData1.legend = true
        })
      } else if (key === '2') {
        getChartBfData('listed', type, fundId).then(res => {
          this.chartData2.datas = res.data || []
          this.chartData2.legend = true
        })
      } else if (key === '3') {
        getChartBfData('investType', type, fundId).then(res => {
          this.chartData3.datas = res.data || []
          this.chartData3.legend = true
        })
      }
    },
    changeFund() {
      this.onChange(this.industry, '1')
      this.onChange(this.listed, '2')
      this.onChange(this.investType, '3')
    },
    /** 新增按钮操作 */
    addHandle() {
      this.formOpen = true
      this.$nextTick(() => {
        this.$refs.bfDisclosureInfoForm.init(null)
      })
    },
    findXIrrDetails(xIrrId) {
      console.log(xIrrId)
      this.xIrrOpen = true
      this.$nextTick(() => {
        this.$refs.xIrrBaseDetailsList.init(xIrrId)
      })
    },
    exportXIrrHandle() {
      this.$nextTick(() => {
        this.$refs.xIrrBaseDetailsList.exportHandle()
      })
    },
    // 预览附件
    onlinePreview(row, type) {
      this.$refs.OnlinePreview.onlinePreviewFile(row.fileId, type)
    },
    /** 查询出资人信息列表 */
    getBfCapitalList() {
      this.capitalLoading = true
      listBfCapital(this.capitalParams).then(response => {
        this.bfCapitalList = response.rows
        this.capitalTotal = response.total
        this.capitalLoading = false
      })
    },
    /** 查询信息披露列表 */
    getBfDisclosureList() {
      this.disclosureLoading = true
      listBfDisclosureInfoHome(this.disclosureParams).then(response => {
        this.bfDisclosureInfoList = response.rows
        this.disclosureTotal = response.total
        this.disclosureLoading = false
      })
    },
    /** 修改按钮操作 */
    updateHandle(row) {
      this.formOpen = true
      this.$nextTick(() => {
        // 调用form页面的 init 方法初始化数据
        this.$refs.bfDisclosureInfoForm.init(row)
      })
    },
    /** 投资组合基金 */
    investFundHandle(row) {
      this.investFundOpen = true
      this.$nextTick(() => {
        // 调用form页面的 init 方法初始化数据
        this.$refs.bfInvestFundForm.init(row)
      })
    },
    /** 出资人信息查看按钮操作 */
    viewHandle(row) {
      this.formCapitalOpen = true
      this.$nextTick(() => {
        // 调用form页面的 init 方法初始化数据
        this.$refs.bfCapitalForm.hidBtn = false
        this.$refs.bfCapitalForm.init(row)
      })
    },
    /** 项目现金流-现金流-承担主体-表单弹窗 */
    investorHandle(row) {
      this.investorOpen = true
      this.$nextTick(() => {
        // 调用form页面的 init 方法初始化数据
        const data = {
          id: row.investorId
        }
        this.$refs.dealInvestmentForm.init(data)
      })
    },
    // 文件类型字典翻译
    fileTypeFormat(row) {
      return this.selectDictLabel(this.fileTypeOptions, row.fileType)
    },
    // 出资人类型字典翻译
    investorTypeFormat(row) {
      return this.selectDictLabel(this.investorTypeOptions, row.investorType)
    },
    // 企业阶段字典翻译
    enterpriseStageFormat(row) {
      return this.selectDictLabel(this.enterpriseStageOptions, row.enterpriseStage)
    },
    // 币种字典翻译
    dealCurrencyFormat(row) {
      return this.selectDictLabel(this.currencyOptions, row.dealCurrency)
    },
    // 币种字典翻译
    stockCurrencyFormat(data) {
      return this.selectDictLabel(this.currencyOptions, data)
    },
    // 上市情况字典翻译
    listedSituationyFormat(data) {
      return this.selectDictLabel(this.listedSituationOptions, data)
    },
    // 上市板块字典翻译
    listedSectorFormat(data) {
      return this.selectDictLabel(this.listedSectorOptions, data)
    },
    // 获取投资组合列表数据投资项目（项目信息、上市情况），投资基金
    getBfInvestGroupList() {
      if (this.radio1 === 'deal') {
        if (this.radio2 === 1) {
          this.getInvestGroupDealInfoList()
        } else {
          this.getInvestGroupDealListed()
        }
      } else {
        this.getInvestGroupFund()
      }
    },
    // 投资项目-项目信息
    getInvestGroupDealInfoList() {
      this.groupLoading = true
      listBfInvestGroup(this.investDealParam).then(response => {
        this.investDealInfoList = response.rows
        this.dealTotal = response.total
        this.groupLoading = false
      })
    },
    // 投资项目-上市情况
    getInvestGroupDealListed() {
      this.groupLoading = true
      listBfInvestGroup(this.investDealListedParam).then(response => {
        this.investDealListedList = response.rows
        this.dealListedTotal = response.total
        this.groupLoading = false
      })
    },
    // 投资基金
    getInvestGroupFund() {
      this.groupLoading = true
      listBfInvestFund(this.investFundParam).then(response => {
        this.investFundList = response.rows
        this.fundTotal = response.total
        console.log('investFundList', response)
        this.groupLoading = false
      })
    },
    onCashFlow(e) {
      if (e === 3) {
        const params = {
          dealId: this.$route.query.id,
          type: 'fundTvpi'
        }
        getXirrDataByType(params).then(response => {
          this.lineChartData = {
            legend: false,
            datas: [],
            legendLeft: 'center',
            xLabel: []
          }
          if (response.data != null) {
            this.lineChartData.xLabel = response.data.xData
            this.lineChartData.datas = [
              {
                name: 'TVPI',
                data: response.data.yData
              }
            ]
          }
        })
      }
      if (e === 1) {
        var params = { dealId: this.$route.query.id, type: this.cashFlowRadio }
        this.getDealCashFLowInfo(params)
      }
      if (e === 2) {
        this.getCashflowList()
      }
    },
    getCashflowList() {
      this.cashLoading = true
      listDealCashflow(this.addDateRange(this.cashflowParams, this.operateDates)).then(response => {
        this.dealCashflowList = response.rows
        this.cashflowTotal = response.total
        // 格式化页面list, 如果所有币种都相同, 展示一列就行
        this.cashLoading = false
      })
    },
    // 数据指标
    getDealCashFLowInfo(params) {
      getDealCashFLowBfInfo(params).then(res => {
        var idx = -1
        var item = null
        if (res.data) {
          for (var i = 0; i < res.data.data.length; i++) {
            if (res.data.data[i].type === 'JY') {
              idx = i
              item = res.data.data[i]
              break
            }
          }
          if (idx !== -1) {
            res.data.data.splice(idx, 1)
          }
          if (item !== null) {
            res.data.data.push(item)
          }
          this.quotaList = res.data
        } else {
          this.quotaList = {
            columns: [],
            data: []
          }
        }
      })
    },
    // 投资组合数据指标
    dealInvestGroupData() {
      dealInvestGroupTarget(this.$route.query.id).then(response => {
        this.investGroupMap = response.data
      })
    }
  }
}
</script>
<style lang="scss" scoped>
.investDetail {
  /deep/.m0 {
    margin: unset !important;
  }

  padding: 13px;
  position: relative;
  font-size: 14px;
  margin: 0 0 15px !important;
  border-radius: 5px;

  .el-col {
    margin-bottom: 8px;
    line-height: 24px;
    display: flex;
    height: 25px;
    .label {
      color: #8a8a8a;
    }

    .link-hover-click {
      color: #333;
      font-weight: bold;
      flex: 1;
      overflow: hidden;
      text-overflow: ellipsis;
    }
  }
}

.mr3 {
  margin-right: 3px;
}

.mb15 {
  margin-bottom: 15px;
}

.block_info {
  display: flex;
  align-items: center;
  column-gap: 20px;

  .block_item {
    flex: 1;
    background-image: linear-gradient(to right, #41B0FF, #0373F6);
    color: #fff;
    position: relative;
    overflow: hidden;
    z-index: 1;
    padding: 7px 15px;
    border-radius: 5px;
    display: flex;
    align-items: flex-end;

    .iconfon {
      width: 35px;
      height: 35px;
      border-radius: 50%;
      background: #fff;
      margin: 0 10px 8px 0;
      display: flex;
      align-items: center;
      justify-content: center;

      i {
        color: #0373F6;
        font-size: 20px;
      }
    }

    .flex1 {
      flex: 1;

      p {
        font-size: 13px;
      }

      .bold {
        font-size: 20px;
      }
    }

    &:nth-child(2) {
      background-image: linear-gradient(to right, #1EC7DA, #1DA3DB);

      .iconfont {
        color: #1DA3DB;
        font-size: 25px;
      }
    }

    &:nth-child(3) {
      background-image: linear-gradient(to right, #8DCCFF, #74A0F8);

      .iconfont {
        color: #74A0F8;
        font-size: 25px;
      }
    }

    &:nth-child(4) {
      background-image: linear-gradient(to right, #4ADAC2, #4BC4F6);

      .iconfont {
        color: #4BC4F6;
        font-size: 25px;
      }
    }

    &:nth-child(5) {
      background-image: linear-gradient(to right, #F4BE2C, #F58725);

      .iconfont {
        color: #F58725;
      }
    }

    &::before,
    &::after {
      position: absolute;
      content: '';
      width: 70px;
      height: 70px;
      border-radius: 50%;
      background: rgba(255, 255, 255, .08);
      top: -33px;
      left: 50px;
      z-index: -1;
    }

    &::after {
      position: absolute;
      content: '';
      border-radius: 50%;
      background: rgba(255, 255, 255, .08);
      top: unset;
      left: unset;
      right: 15px;
      bottom: -30px;
      z-index: -1;
    }
  }
}
.mr15{
  margin-right: 15px;
}
.finance {
  display: flex;
  justify-content: space-between;

  /deep/.el-input__inner {
    border-radius: 20px;
  }
}
///deep/.el-table__header th {
//    background-color: #41A0FE !important;
//    color: #fff !important;
//    border-right: 1px solid rgba(255,255,255,.3)!important;
//}

/deep/.dealEvent .overAuto {
  height: calc(100% - 20px)!important;
}

/deep/.customDialog .el-dialog__body {
  height: 48vh;
  overflow-y: auto;
  .list-table {
    margin: -20px;
  }
}

</style>
